<template>
  <div class="el-mr-mathouseTable"> 
    <div class="el-mr-mh-firstbg">
      <el-table
        ref="receiveTable"
        size="mini"
        :data="resData"
        style="width: 100%"
        @selection-change="handleSelectionChange"
        highlight-current-row
        height="210"
        :cell-style="cellStyle">
        <el-table-column type="selection" width="40"> </el-table-column>
        <el-table-column type="index" label="序号" width="45" :show-overflow-tooltip="true"> </el-table-column>
        <el-table-column prop="barcode" label="条码" width="130" :show-overflow-tooltip="true"> </el-table-column>
        <el-table-column prop="aoNo" label="AO号" width="170" :show-overflow-tooltip="true" > </el-table-column>
        <el-table-column prop="itemCode" label="图号" width="170" :show-overflow-tooltip="true" > </el-table-column>
        <el-table-column prop="qualityCode" label="质量编号/件号" width="170" :show-overflow-tooltip="true"> </el-table-column>
        <el-table-column prop="mProductNumber" label="成品型号" width="150" :show-overflow-tooltip="true"> </el-table-column>  
        <el-table-column prop="deliveryQty" label="接收数量" :show-overflow-tooltip="true"> </el-table-column>
        <el-table-column prop="storageQty" label="已入库数量" :show-overflow-tooltip="true"> </el-table-column>
        <el-table-column prop="itemName" label="物料名称" width="100" :show-overflow-tooltip="true"> </el-table-column>
        <el-table-column prop="itemType" label="物料大类" :show-overflow-tooltip="true"> </el-table-column>
        <el-table-column prop="productCode" label="机型" width="130" :show-overflow-tooltip="true"> </el-table-column>
        <el-table-column prop="batchNo" label="批次" :show-overflow-tooltip="true"> </el-table-column>
        <el-table-column prop="startLotNo" label="架次" :show-overflow-tooltip="true"> </el-table-column>
        <el-table-column prop="attribute18" label="制造单位" :show-overflow-tooltip="true"> </el-table-column>
        <el-table-column prop="deliveryDate" label="移交时间" width="170" :show-overflow-tooltip="true"> </el-table-column>
        <el-table-column prop="sender" label="是否分拣" :show-overflow-tooltip="true"> </el-table-column>
        <el-table-column prop="receiveRemark" label="备注" :show-overflow-tooltip="true"> </el-table-column>
      </el-table>
      <!-- 分页 -->
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="pageNumber"
        :page-sizes="[10,20,50,100]"
        :page-size="pageSize"
        layout="total, sizes, prev, pager, next, jumper"
        :total="totalCount">
      </el-pagination>
    </div>
  </div>
</template>
<script>

import { mrMhAll } from "@/utils/api.js";
import request from "@/utils/request.js";

export default {
  name: "MathouseTable",
  data() {
    return {
      // 当前页数
      pageNumber: 1,
      // 数据总个数
      totalCount: 0,
      // 返回的数据数组
      resData: [],
      // 每页数据个数
      pageSize: 20,
      // 确认列表高亮参数
      stableIndex: 0,
      // 储存勾选的物料条码信息
      preMaterialTm:[],
      materialTM:[],
      // 存储hcx扫码的箱子里的物料条码集合
      hcxBarcodes:[]
    };
  },
  methods: {
    // 勾选函数
    handleSelectionChange(val){
      this.materialTM = []
      for(let i=0;i<val.length;i++){
        this.materialTM.push(val[i].barcode)
      }
      // 传给出库 回库 数据信息
      this.$bus.$emit('mwMbBoxInfo',val);
      //yebo 
      this.$bus.$emit('selectBackDeliverys',val);
    },
    // 选择每页条数后请求接口更新表格
    handleSizeChange(val) {
      // console.log(1,val)
      this.pageSize = val
    /*  mrMhAll({
        funcType:"putInStorage",
        pageParameter: {
          rows: this.pageSize,
          page: this.pageNumber,
        },
      }).then((res) => {
        this.resData = res.data.responseBody.result;
        this.totalCount = res.data.responseBody.pageParameter.totalCount;
      });*/
      this.$options.methods.loadUnStoreMaterial.bind(this)();
    },
    // 分页函数
    handleCurrentChange(val) {
      this.pageNumber = val;
       /* mrMhAll({
          funcType:'putInStorage',
          pageParameter: {
            rows: this.pageSize,
            page: this.pageNumber,
          },
        }).then((res) => {
          this.resData = res.data.responseBody.result;
          this.totalCount = res.data.responseBody.pageParameter.totalCount;
        });*/
        this.$options.methods.loadUnStoreMaterial.bind(this)();
    },
    cellStyle(val){
      // console.log("val",val)
      if(typeof(val)=="undefined"){
        return ;
      }
      for(let ce=0;ce<this.hcxBarcodes.length;ce++){
        if(val.row.barcode == this.hcxBarcodes[ce]){
          return 'background-color:#67C23A'
        }
      }
    },
    loadUnStoreMaterial(){
      request.post("/WmsDeliverPlan/searchBeputMaterial",{pageSize: this.pageSize,currentPage: this.pageNumber,}).then((res)=>{
        console.log("res",res);
        this.resData = res.data.list;
        this.totalCount = res.data.total;
      })
    }  
  },
  mounted() {
    // 接收hcx扫码的物料信息 进行高亮
    this.$bus.$on('mwHcxmGaoLiang',(e)=>{
      
      for(let ci=0;ci<e.length;ci++){
        this.hcxBarcodes.push(e[ci].barcode)
      }
      this.$options.methods.cellStyle.bind(this)()
    })
    // 刷新Table
    this.$bus.$on('mrMwReTable',(e)=>{
      /*mrMhAll({
        funcType:'putInStorage',
        pageParameter: {
          rows: this.pageSize,
          page: this.pageNumber,
        },
      }).then((res) => {
        console.log('回库刷新Table',res)
        this.resData = res.data.responseBody.result;
        this.totalCount = res.data.responseBody.pageParameter.totalCount;
      });*/
      this.$options.methods.loadUnStoreMaterial.bind(this)();
    })
   /* mrMhAll({
        funcType:'putInStorage',
        pageParameter: {
          rows: this.pageSize,
          page: this.pageNumber,
        },
      }).then((res) => {
        this.resData = res.data.responseBody.result;
        this.totalCount = res.data.responseBody.pageParameter.totalCount;
        console.log('物料入库上表',res)
      });*/

      this.$options.methods.loadUnStoreMaterial.bind(this)();
  },
};
</script>
<style scoped>
.el-mr-mh-firstbg {
  width: 100%;
  height: 100%;
  text-align: center;
}
.el-pagination {
  text-align: center;
}
/* .el-mr-mathouseTable {
  height: 230px;
} */

</style>